{extend name="public/layer_base" /}
{block name='content'}
<!--数据列表页面-->
<div class="layui-fluid x-admin-sm">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">


                <div class="layui-card-body ">
                    <div class="layui-tab layui-tab-brief" lay-filter="pluginList">
                        <ul class="layui-tab-title">
                            <li class="layui-this">全部插件</li>
                            <li>本地插件</li>
                        </ul>

                        <div class="layui-tab-content">
                            <div class="layui-tab-item layui-show">
                                <table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
                            </div>

                            <div class="layui-tab-item">
                                <table class="layui-hide" id="tableIdbd" lay-filter="tableFilter"></table>
                            </div>
                        </div>

                    </div>
                </div>

            </div>
        </div>
    </div>
    <script>
        layui.use(["element", "jquery", "table", "form", "laydate", "okLayer", "okUtils", "okMock"], function () {
            let table = layui.table,form = layui.form, laydate = layui.laydate,okLayer = layui.okLayer, okUtils = layui.okUtils, okMock = layui.okMock;

            //全部插件
            let userTable = table.render({
                elem: '#tableId',
                url: '{:url("getAllplug")}',
                cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                limit: 10000,
                page: false,
                toolbar: true,
                toolbar: "#toolbarTpl",
                height: 'full',
                cols: [[
                    // {field: "intro", title: "标识", width: 100, sort: true},
                    { field: "title", title: "名称" },
                    { field: "version", title: "版本", width: 80 },
                    { field: "description", title: "简述", width: 420 },
                    { field: "author", title: "作者", width: 80 },
                    { field: "price", title: "价格", width: 80 },
                    { field: "sales", title: "销量", width: 80 },
                    { field: "status", title: "状态", templet: "#statusTpl", width: 120 },

                    { field: "button", title: "操作按钮", minWidth: 180 },
                ]],
                done: function (res, curr, count) {
                    console.info(res, curr, count);
                }
            });

            //本地插件
            let userTablebd = table.render({
                elem: '#tableIdbd',
                url: '{:url("localPlugin")}',
                cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                limit: 10000,
                page: false,
                toolbar: true,
                toolbar: "#toolbarTpl",
                height: 'full',
                method: 'post',
                cols: [[
                    { field: "name", title: "标识", width: 100, sort: true },
                    { field: "title", title: "名称", width: 200 },
                    { field: "version", title: "版本", width: 80 },
                    { field: "description", title: "简述", width: 420 },
                    { field: "author", title: "作者", width: 100 },
                    { field: "status", title: "状态", width: 120, templet: "#statusTpl" },
                    { field: "button", width: 180, title: "操作按钮" },
                ]],
                parseData: function (res) { //res 即为原始返回的数据
                    return {
                        "code": 0,
                        "msg": res.msg, //解析提示文本
                        "count": res.data.count, //解析数据长度
                        "data": res.data.data //解析数据列表
                    };
                },
                done: function (res, curr, count) {
                    // console.info(res, curr, count);
                }
            });

            //监听性别操作
            form.on('switch(status)', function (obj) {
                var swt = $(obj.elem);
                swt.prop('checked', !obj.elem.checked);
                layui.form.render();//刷新表格
                state(obj.value, obj.elem)
            });
            table.on("toolbar(tableFilter)", function (obj) {
                switch (obj.event) {
                    case "batchEnabled":
                        batchEnabled();
                        break;
                    case "batchDisabled":
                        batchDisabled();
                        break;
                    case "batchDel":
                        batchDel();
                        break;
                    case "add":
                        add();
                        break;
                }
            });

            table.on("tool(tableFilter)", function (obj) {
                let data = obj.data;
                switch (obj.event) {
                    case "install":
                        install(data.name);
                        break;
                    case "uninstall":
                        uninstall(data.name);
                        break;
                    case "config":
                        config(data.name);
                        break;
                    case "installyuancheng":
                        installyuancheng(data.name);
                        break;
                }
            });

            //安装远程插件
            function installyuancheng(id) {
                const Storage = {};
                Storage.get = function (name) {
                    return localStorage.getItem(name);
                }
                var caomei_tokeny = Storage.get("caomeiadmin_userinfo");
                layer.confirm("确定要安装吗？", function () {
                    okUtils.ajax("{:url('installyuancheng')}", "get", { id: id, token: caomei_tokeny }, true).done(function (response) {
                        if (response.code == '1') {
                            console.log(response);
                            //userTable.reload();
                            //okUtils.tableSuccessMsg(response.msg);
                            layer.greenTickMsg(response.msg, function () {
                                userTable.reload();
                                userTablebd.reload();
                            })
                        } else {

                            if (response.code == '-3' || response.code == '-4') {
                                //未登录
                                layer.redCrossMsg(response.msg, function () {
                                    layer.open({
                                        type: 2,
                                        title: '用户登录',
                                        maxmin: true,
                                        skin: 'layui-layer-lan',
                                        shadeClose: true, //点击遮罩关闭层
                                        area: ['600px', '480px'],
                                        content: '{:url("caomei/login")}'//弹框显示的url
                                    });
                                });
                            } else {
                                layer.redCrossMsg(response.msg, function () {
                                })
                            }


                            if (response.code == '-5') {
                                //未购买
                                layer.redCrossMsg(response.msg, function () {
                                    var html = "<img style='height: 200px;width: 200px;' src='" + response.data.img + "' >";
                                    layer.open({
                                        type: 2,
                                        title: '请使用手机扫码二维码支付',
                                        shade: [0.001, '#393D49'],
                                        area: ['500px', '500px'],
                                        // skin : 'layui-layer-nobg', //沒有背景色
                                        shadeClose: true,
                                        content: '{:url("caomei/payqr")}?img=' + response.data.code_url + '&order_sn=' + response.data.order_sn + '&name=' + response.data.name //弹框显示的url
                                    });
                                });
                            } else {
                                layer.redCrossMsg(response.msg, function () {
                                })
                            }

                        }

                    }).fail(function (error) {
                        console.log(error)
                    });
                })
            }

            //安装本地插件
            function install(id) {
                layer.confirm("确定要安装吗？", function () {
                    let loadT = layer.msg('正在安装，请稍候…', {
                        icon: 16,
                        time: 0,
                        shade: [0.3, "#000"],
                        scrollbar: false,
                    });
                    $.ajax({
                        url: "{:url('install')}",
                        dataType: 'json',
                        type: 'post',
                        data: { 'id': id },
                        success: function (result) {
                            if (result.code == 1) {
                                layer.msg(result.msg, {
                                    icon: 1,
                                    scrollbar: false,
                                }, function () {
                                    userTable.reload();
                                    userTablebd.reload();
                                })

                            } else {
                                layer.msg(result.msg, {
                                    icon: 2,
                                    scrollbar: false,
                                });
                                return false;
                            }

                        },
                        error: function (xhr, type, errorThrown) {
                            layer.msg('安装失败');


                        },
                        complete: function () {
                            layer.close(loadT);

                        }
                    })


                })
            }

            function config(id) {
                okLayer.open("配置", "config?name=" + id, "90%", "90%", function (layero) {
                    //let iframeWin = window[layero.find("iframe")[0]["name"]];
                    //iframeWin.initForm(data);
                }, function () {
                    userTable.reload();
                    userTablebd.reload();
                })

            }

            function uninstall(id) {
                layer.confirm("确定要卸载安装吗？", function () {

                    $.ajax({
                        url: "{:url('uninstall')}",
                        dataType: 'json',
                        type: 'post',
                        data: { 'id': id },
                        success: function (result) {
                            if (result.code == 1) {
                                layer.msg(result.msg, {
                                    icon: 1,
                                    scrollbar: false,
                                }, function () {
                                    userTable.reload();
                                    userTablebd.reload();
                                })

                            } else {
                                layer.msg(result.msg, {
                                    icon: 2,
                                    scrollbar: false,
                                });
                                return false;
                            }
                        }
                    });

                })
            }
            function state(id) {
                layer.confirm("确定执行此操作吗？", function () {
                    $.ajax({
                        url: "{:url('state')}",
                        dataType: 'json',
                        type: 'post',
                        data: { 'id': id },
                        success: function (result) {
                            if (result.code == 1) {
                                layer.msg(result.msg, {
                                    icon: 1,
                                    scrollbar: false,
                                }, function () {
                                    userTable.reload();
                                    userTablebd.reload();
                                })

                            } else {
                                layer.msg(result.msg, {
                                    icon: 2,
                                    scrollbar: false,
                                });
                                return false;
                            }
                        }
                    });

                })
            }
        })
    </script>
    <!-- 头工具栏模板 -->
    <script type="text/html" id="toolbarTpl">
        <div class="layui-btn-container">
            
        </div>
    </script>
    <!-- 行工具栏模板 -->


    <script type="text/html" id="statusTpl">

                {{# if(d.install==1){ }}
                <input type="checkbox" value="{{d.name}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="status" {{ d.status == 1 ? 'checked' : '' }}>
    
                {{# } }}
    
    </script>
    {/block}